<template>
  <h1>vue3</h1>
  <p>{{ count }}</p>
  <!-- 
    vue2
      默认给组件绑定的事件都是自定义事件（即使事件名是click）
      除非加上 @click.native，才是绑定DOM事件

      vue2自定义事件的方法：
        $on
        $once
        $off
        $emit
        借助以上方法，可以实现全局事件总线
        
    vue3
      默认给组件绑定的事件都是DOM事件(注意：子组件必须有根标签，才能绑定上DOM事件)
        vue3移除.native事件修饰符
      除非子组件通过emits声明接受事件，才是自定义事件
        vue3自定义事件的方法只剩下$emit方法，其他方法删除了，vue3不能使用全局事件总线（pubsub、mitt）
   -->
  <Child @click="handleClick" />
</template>

<script lang="ts">
import Child from "./Child.vue";

export default {
  name: "App",
  components: { Child },
  data() {
    return {
      count: 0,
    };
  },
  methods: {
    handleClick() {
      this.count++;
    },
  },
};
</script>

<style scoped></style>
